<template>
	<view class="content">
		<view class="list" v-for="(item,index) in list">
			<view @click="go" class="list-item">
				<p class="tit slh_two">{{item.title}}？</p>

				<view class="right">

					<view class="desc ellipsis_3">
						{{item.content}}
					</view>
					<img :src="img_src+ item.image[0]">

				</view>
				<view class="info">
					<text>行情资讯</text>
					<text>{{item.createtime}}</text>
					<text style="flex-grow: 1">{{item.view}}人阅读</text>
					<!-- <text class="icon">
						<u-icon size="13" name="close"></u-icon>
					</text> -->
					<!--                    <icon  icon="close" size="20" color="#999999"></icon>-->
					<!--                    <u-tag plain shape="circle" size="mini"  borderColor="#999999"></u-tag>-->

				</view>

			</view>
		</view>
	</view>
</template>
<script>
	export default {
		name: 'index',
		components: {},
		props: {
			list: {
				type: Array,
				default: []
			}
		},
		data() {
			return {
				img_src: this.$.img_src
			}
		},
		methods: {
			go() {
				// uni.navigateTo({url:'/pages/buy/supplyDetails'})
			}
		},
		created() {

		},
		mounted() {

		},
	}
</script>

<style lang="scss" scoped>
	.content {
		// margin: 20rpx;
		border-right: 12rpx;
		background-color: #fff;
		// padding: 20rpx;

		.list {
			padding: 20rpx;

			.list-item {

				padding: 20rpx 0;
				border-bottom: 1rpx solid #F4F4F4;
				align-items: center;
				gap: 20rpx;
				color: #222222;

				.tit {
					font-size: 32rpx;
					font-weight: 500;
				}

				.right {
					margin: 20rpx 0;
					display: flex;
					color: #222222;
					gap: 20rpx;
					justify-content: space-between;

					.desc {
						flex: 1;
						white-space: pre-wrap;
						/* 允许在单词内换行 */
						word-break: break-all;
						/* 允许在任意字符处换行 */
						color: #444444;
						font-weight: 400;
						font-size: 28rpx;

					}
				}

				img {
					flex-shrink: 0;
					width: 168rpx;
					height: 120rpx;
					border-radius: 8rpx;

				}

				.info {
					display: flex;
					align-items: center;
					gap: 10rpx;
					color: #999999;
					font-size: 24rpx;
					font-weight: 400;

					.icon {
						padding: 0 6rpx;
						border: #666666 1rpx solid;
						border-radius: 30rpx;
					}
				}
			}

			.list-item:last-child {
				border: none;
			}
		}
	}
</style>